<template>
  <div>
    <!-- 收款单 -->
    <!-- 表单 -->
    <!-- <el-form ref="form" :model="form" label-width="80px" :inline="true">
      <el-form-item label="支付类型">
        <el-select v-model="form.pay" placeholder="请选择">
          <el-option label="微信" value="wx"></el-option>
          <el-option label="支付宝" value="zfb"></el-option>
          <el-option label="虚拟币支付" value="xn"></el-option>
          <el-option label="苹果支付" value="pg"></el-option>
          <el-option label="赠送" value="zs"></el-option>
          <el-option label="优惠券支付" value="yh"></el-option>
          <el-option label="线下支付" value="xx"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="支付终端">
        <el-select v-model="form.status" placeholder="请选择">
          <el-option label="安卓" value="az"></el-option>
          <el-option label="IOS" value="ios"></el-option>
          <el-option label="H5" value="h5"></el-option>
          <el-option label="小程序" value="xcx"></el-option>
          <el-option label="微信内置H5" value="wx"></el-option>
          <el-option label="IPAD" value="ipad"></el-option>
          <el-option label="管理" value="gl"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="状态">
        <el-select v-model="form.status" placeholder="请选择">
          <el-option label="准备发起支付" value="zb"></el-option>
          <el-option label="支付成功" value="cg"></el-option>
          <el-option label="支付失败" value="sb"></el-option>
          <el-option label="取消" value="qx"></el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="支付时间">
        <el-date-picker
          type="date"
          placeholder="开始日期一结束日期"
          v-model="form.date1"
          style="width: 300px;"
        ></el-date-picker>
      </el-form-item>
      <el-form-item label="订单号">
        <el-input v-model="form.shopName" placeholder="请输入订单号"></el-input>
      </el-form-item>
      <el-form-item label="手机号">
        <el-input
          v-model="form.tel"
          placeholder="请输入订单用户手机号"
        ></el-input>
      </el-form-item>
      <el-form-item>
        <el-button icon="el-icon-search">搜索</el-button>
      </el-form-item>
      <el-form-item>
        <el-button @click="cz" icon="el-icon-refresh-left">重置</el-button>
      </el-form-item>
    </el-form> -->
   
    <!-- 余额管理 -->
    <el-form :model="form" :inline="true">
      <el-form-item label="活动区域">
        <el-select v-model="form.studentS" placeholder="请选择">
          <el-option label="启用" value="1"></el-option>
          <el-option label="禁用" value="0"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="学生名称">
        <el-input v-model="form.names" placeholder="学生名称"></el-input>
      </el-form-item>
      <el-form-item label="手机号">
        <el-input v-model="form.tel" placeholder="手机号"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button icon="el-icon-search">搜索</el-button>
        <el-button icon="el-icon-refresh-right">重置</el-button>
      </el-form-item>
    </el-form>
    <p>
      <el-button type="primary">新增学员</el-button>
      <el-button type="primary">批量导入</el-button>
      <el-button type="primary">批量导出</el-button>
      <el-button type="primary">查看报表</el-button>
    </p>
    <p>
       <el-table
    ref="multipleTable"
    :data="tableData"
    tooltip-effect="dark"
    style="width: 100%"
    @selection-change="handleSelectionChange">
    <el-table-column
      type="selection"
      width="55">
    </el-table-column>
    <el-table-column
      label="学生名称"
      >
    </el-table-column>
    <el-table-column
      prop="name"
      label="手机号"
      >
    </el-table-column>
    <el-table-column
      prop="address"
      label="状态"
      show-overflow-tooltip>
    </el-table-column>
    <el-table-column
      prop="address"
      label="创建时间"
      show-overflow-tooltip>
    </el-table-column>
    <el-table-column
      prop="address"
      label="操作"
      show-overflow-tooltip>
    </el-table-column>
  </el-table>
    </p>
  </div>
</template>

<script>
import { getStudents } from "../../api/api6";
export default {
  data() {
    return {
      form:{
        studentS:"",
        names:"",
        tel:""
      },
      query:{
            page: 1,
            limit: 10,
            status: "",
            nickname:"",
            mobile: ""
      }
    };
  },
  mounted() {},
  methods: {
    getList(){
        getStudents().then((res)=>{
          console.log(res);
        })
    }
  }
};
</script>

<style lang="scss"></style>

    
    
    <p>
      <el-button type="primary">导入</el-button>
    </p>
    <!-- 表格数据 -->
    <p>
      <el-table :data="tableData" stripe border style="width: 100%">
        <el-table-column
          prop="date"
          label="订单编号"
          width="180"
        ></el-table-column>
        <el-table-column
          prop="name"
          label="商品名称"
          width="180"
        ></el-table-column>
        <el-table-column prop="address" label="订单金额"></el-table-column>
        <el-table-column prop="address" label="订单状态"></el-table-column>
        <el-table-column prop="address" label="支付类型"></el-table-column>
        <el-table-column prop="address" label="买家"></el-table-column>
        <el-table-column prop="address" label="买家手机号"></el-table-column>
        <el-table-column prop="address" label="下单时间"></el-table-column>
        <el-table-column prop="address" label="更新时间"></el-table-column>
        <el-table-column prop="address" label="操作"></el-table-column>
      </el-table>
    </p>
    <!-- 分页 -->
    <!-- <p style="text-align: right">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage4"
        :page-sizes="[6, 8, 10, 15]"
        :page-size="100"
        layout="total, sizes, prev, pager, next, jumper"
        :total="100"
      ></el-pagination>
    </p> -->
  </div>
</template>

<script>
export default {
  data() {
    return {
      form: {
        status: "",
        pay: "",
        shopName: "",
        order: "",

        tel: ""
      },
      // 每页几条数据
      pageSize: "",
      // 第几页
      pageNum: ""
    };
  },
  mounted() {},
  methods: {
    handleCurrentChange(val) {
      console.log(val);
    },
    handleCurrentChange() {
      console.log(val);
    },
    cz() {}
  }
};
</script>

<style lang="scss">
.title {
  background-color: #fff;
  border-bottom: 1px solid #cccccc;
  box-sizing: border-box;
  padding: 10px 20px;
  margin-bottom: 30px;
  // text-align: right;
}
.el-table th,
.el-table tr {
  background-color: #eeeeee;
  color: black;
}
</style>
